<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	template="/layout/page/form/page-fieldset-template.xhtml">

	<ui:param name="pageViewBean" value="#{commonContentViewBean}" />
	<ui:param name="compId" value="#{pageViewBean.id}" />
	<ui:param name="compTitle" value="修改个人资料" />

	<ui:define name="compContent">
		<table>
			<tr>
				<td style="width:28%" valign="top">
					<table>
			    		<tr>
			    			<td>
			    				<div>
			    					<img src="img/head_100.jpg" style="width:100px;height:100px;"/>
			    					<p:commandButton value="Effects" onclick="dlg3.show();" type="button" /> 
								    <p:dialog header="Effects" widgetVar="dlg3" showEffect="explode" hideEffect="explode" width="400" height="500">  
										  <div>
										  	    待做
										  </div>
									</p:dialog>
				        	 	</div>
			    			</td>
			    		</tr>
		    		</table>
				</td>
				<td style="width:72%">
					<table border="0">
					  <tr>
					    <td>所在单位：</td>
					    <td align="left"><h:outputText id="orgNames" value="#{pageViewBean.orgNames}" /></td>
					  </tr>
					  <tr>
					    <td align="right">用户编号：</td>
					    <td align="left"><h:outputText id="userCode" value="#{pageViewBean.userCode}" /></td>
					  </tr>
					  <tr>
					    <td align="right">登录名：</td>
					    <td align="left"><h:outputText id="loginName" value="#{pageViewBean.loginName}" /></td>
					  </tr>
					  <tr>
					    <td align="right">用户类型：</td>
					    <td align="left"><h:outputText id="roleNames" value="#{pageViewBean.usertype}" /></td>
					  </tr>
					  <tr>
					    <td align="right">警号：</td>
					    <td align="left"><h:outputText id="userPoliceNum" value="#{pageViewBean.userPoliceNum}" /></td>
					  </tr>
					  <tr>
					    <td align="right">排序号：</td>
					    <td align="left">排序号</td>
					  </tr>
					  <tr>
					    <td align="right">用户姓名：</td>
					    <td align="left"><h:outputText id="userRealName" value="#{pageViewBean.userRealName}" /></td>
					  </tr>
					  <tr>
					    <td align="right">身份证号：</td>
					    <td align="left"><h:outputText id="userIcardId" value="#{pageViewBean.userIcardId}" /></td>
					  </tr>
					  <tr>
					    <td align="right">性别：</td>
					    <td align="left">
							<p:selectOneRadio id="userSex" value="#{pageViewBean.userSex}">
								<f:selectItem itemLabel="男" itemValue="0" />
								<f:selectItem itemLabel="女" itemValue="1" />
							</p:selectOneRadio>
						</td>
					  </tr>
					  <tr>
					    <td align="right">出生日期：</td>
					    <td align="left">
							<p:calendar id="userBirthday" size="16" mode="popup" showOn="button" 
								value="#{pageViewBean.userBirthday}"
								pattern="yyyy年MM月d日 " styleClass="{date:true}" locale="zh" popupIconOnly="true" />
						</td>
					  </tr>
					  <tr>
					    <td align="right">办公电话：</td>
					    <td align="left"><h:inputText id="userOfficeTel" styleClass="{maxlength:16}" value="#{pageViewBean.userOfficeTel}" /></td>
					  </tr>
					  <tr>
					    <td align="right">手机号码：</td>
					    <td align="left"><h:inputText id="userMobile" styleClass="{required:true,mobile:true}" value="#{pageViewBean.userMobile}" /></td>
					  </tr>
					  <tr>
					    <td align="right">电子邮件：</td>
					    <td align="left"><h:inputText id="userEmail" styleClass="{email:true}" value="#{pageViewBean.userEmail}" /></td>
					  </tr>
					  <tr>
					    <td align="right">用户签名：</td>
					    <td align="left">
							xxxxx
						</td>
					  </tr>
					  <tr>
					    <td align="right">用户头像：</td>
					    <td align="left">
					    	
					    	<h:panelGrid columns="2" cellspacing="0" cellpadding="0" border="0">
								<h:selectOneMenu id="userHeadPhoto" 
									onchange="#{compId}_changeIcon()"
									value="#{commonContentViewBean.userHeadPhoto}">
									<f:selectItems value="#{commonContentViewBean.headIconPaths}"/>
								</h:selectOneMenu>
								<h:graphicImage id="userHeadPhotoImage" width="32" height="32" style="margin-left:10px;" url="img/#{commonContentViewBean.headIconPath}" />
						    </h:panelGrid>
							<p:remoteCommand name="#{compId}_changeIcon" update="userHeadPhotoImage" />
							
						</td>
					  </tr>
					</table>	
				</td>
			</tr>
		</table>
		 <script type="text/javascript">
			$(document).ready(function(){
				var jcrop_api;
				initJcrop();
				function initJcrop(){
					jcrop_api = $.Jcrop("#xuwanting");
					jcrop_api.setOptions(true?{
						minSize:[80, 80],
						maxSize:[100, 100]
					}:{
						minSize:[0, 0],
						maxSize:[0, 0]
					});
				};

			});	

			function showPic(){
	            var file= document.getElementById('fileId');
	            var pic=document.getElementById('xuwanting');
	            pic.src="img/"+file.value;
	         }
		</script>
	</ui:define>
	
	<ui:define name="compButtons">
		<p:commandButton
			actionListener="#{orgAction.personEdit}" title="保存"
			onstart="SinoPortal.Validation.validateFormForDocument('#{compId}_form')"
			image="./img/icons/add.png" value="保存" style="margin:5px;"
			update="#{pageViewBean.id}_form">
			<h:inputHidden value="#{pageViewBean.id}" />
		</p:commandButton>
	</ui:define>
	
	
</ui:composition>